<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<script type="text/javascript">
window.onload = function(){
	var signIn = document.getElementById("sign-in");
	
}
function login(){
	var name = document.getElementById("userName");
	var passwd = document.getElementById("userPasswd");
	var msg = document.getElementById("login-msg");
	if(name.value=="" || name.value=="Enter Your ID"){
		msg.innerText = "Enter your ID";
		name.value = "";
		name.focus();
		return;
	}
	if(passwd.value=="" || passwd.value=="Enter Your PassWord"){
		msg.innerText = "Enter your Password";
		passwd.value="";
		passwd.focus();
		return;
	}
	var data ={id : $('#userName').val(), passwd:$('#userPasswd').val()}
	$.ajax({
		type : "POST",
		url : "login.do",
		data : data,
		success: function(msg){
			if(msg.length>10){
				$('#login-msg').html(msg);
			}else{
				//location.reload();
				$('#sign-in-top-menu').html(msg);
			}
		}
	});
}
</script>
<div id="upper-menu-container" >
		<div id="page-menu-wrapper">
			<ul class="main left no-js">
				<li><a href="main.do" class="top-menu home menu-general"><span
						aria-hidden="true" class="icn_logo"></span></a></li>
				<li class="submenu-item mobile-class"><a href="#" class="top-menu  menu-general">맛집 세상 </a>
					<div class="dropdown-menu categories">
						<div class="menu-header">
							<ul id="menu-nav-menu-1" class="menu" >
								<li	class="menu-item"><a href="info.do?content=intro" class="menu-item-font">소개 </a></li>
								<li	class="menu-item"><a href="info.do?content=developer">개발자 </a></li>
								<li	class="menu-item"><a href="info.do?content=notice">공지 사항 </a></li>
								<li	class="menu-item"><a href="info.do?content=QnA">문의 하기 </a></li>
								<li	class="menu-item"><a href="info.do?content=location">오시는 길 </a></li>
							</ul>
						</div>
					</div></li>
				<li class="submenu-item mobile-class"><a href="#"
					class="top-menu menu-general">전국 맛집  </a>
					<div class="dropdown-menu categories">
						<div class="menu-header">
							<ul id="menu-nav-menu-1" class="menu">
								<li	class="menu-item"><a href="#">서  울</a></li>
								<li	class="menu-item"><a href="#">경기도</a></li>
								<li	class="menu-item"><a href="#">강원도</a></li>
								<li	class="menu-item"><a href="#">충청도</a></li>
								<li	class="menu-item"><a href="#">전라도</a></li>
								<li	class="menu-item"><a href="#">경상도</a></li>
								<li	class="menu-item"><a href="#">제주도</a></li>
								<li	class="menu-item"><a href="#">해  외</a></li>
							</ul>
						</div>
					</div></li>

				<li class="mobile-class">
					<div class="top-menu menu-general search">
						<span class="label">Search<span class="cursor"></span></span>
						<div class="formsearch">
							<form id="search" action="#" method="get" target="_top">
								<input type="text" name="q" class="search-input"> <input
									type="hidden" name="cx"
									value="partner-pub-8533961490949414:1129877839"> <input
									type="hidden" name="cof" value="FORID:10"> <input
									type="hidden" name="ie" value="UTF-8">
							</form>
							<span class="gobutton"><span aria-hidden="true"
								class="search_icon"></span></span>
						</div>
					</div>
				</li>
			</ul>
			<ul style="float: right; right: -1px; position: relative;"
				class="main right no-js">
				<li class="submenu-item mobile-class"><a href="#"
					class="top-menu menu-general">Follow us</a>

					<div class="dropdown-menu follow">
						<ul class="social">
							<li><a href="#" title="" class="rss" rel="nofollow"
								target="_blank"><span aria-hidden="true" class="icn_rss"></span>RSS</a></li>
							<li><a href="#" title="" class="twitter" rel="nofollow"
								target="_blank"><span aria-hidden="true" class="icn_twitter"></span>Twitter</a></li>
							<li><a href="#" title="" class="facebook" rel="nofollow"
								target="_blank"><span aria-hidden="true"
									class="icn_facebook"></span>Facebook</a></li>
							<li><a href="#" title="" class="googleplus" rel="nofollow"
								target="_blank"><span aria-hidden="true"
									class="icn_googleplus"></span>Google+</a></li>
							<li><a href="#" title="" class="dribbble" rel="nofollow"
								target="_blank"><span aria-hidden="true"
									class="icn_dribbble"></span>Dribbble</a></li>
						</ul>
						<div class="counter">356421 Subscribers &amp; Followers</div>
					</div></li>

				<c:choose>	
				<c:when test="${empty(sMember)}">
					<li class="submenu-item mobile-class" id="sign-in-top-menu"><a 
						class="top-menu" style="color:black"> <label>Sign In</label>
					</a><div class="dropdown-menu">
							<table class="table-striped-main">
								<tr><td>&emsp;</td></tr>
								<tr><td><strong>UserName:</strong></td><td><input type="text" class="input-text" id="userName"  value="Enter Your ID" tabindex="1" onclick="this.value=''"></td></tr>
								<tr><td><strong>Password:</strong></td><td><input id="userPasswd" type="text" class="input-text" value="Enter Your PassWord" onclick="this.type='password',this.value=''"></td></tr>
								<tr><td align="center" colspan="2"><span id="login-msg" style="color:#FF5A5A;font-family:Georgia;font-size: 12px;">&emsp;</span></td></tr>
								<tr><td id="loggin-button-td" colspan="2"><a style="color: white;" href="javascript:login()" class="login-button" id="login">Login</a><a style="color: white;" href="join.do" class="login-button" id="join">Join</a></td></tr>
								<tr><td>&emsp;</td></tr>
							</table>
					</div></li>
				</c:when>
				<c:otherwise>	
				<li class="submenu-item mobile-class" id="member-top-menu"><a 
					class="top-menu" style="color:black"> <label>Hello, ${sMember.id}</label>
				</a><div class="dropdown-menu">
						<div class="menu-header">
							<ul id="menu-nav-menu-1" class="menu">
								<li	class="menu-item"><a href="member.do?content=mypage" class="menu-item-font">회원정보  </a></li>
								<li	class="menu-item"><a href="member.do?content=myBoard">내 게시글 관리 </a></li>
								<li	class="menu-item"><a href="logout.do">로그 아웃 </a></li>
							</ul>
						</div>
				</div></li>
				</c:otherwise>
				</c:choose>
			</ul>
		</div>
	</div>
	<!--end header-wrapper-->